<template>
  <div class="tab">
    <div v-for="tab in tabList" :key="tab" @click="changeTab(tab)">{{ tab }}</div>
  </div>
</template>

<script>
import store from './store';
export default {
    data(){
        return {
            tabList:['主页','中心']
        }
    },
    methods:{
        changeTab(tab){
            console.log(store);
            store.publish(tab);
        }
    }
};
</script>


<style scoped>
.tab{
    width: 100vw;
    display: flex;
    height: 10vh;
    background-color: antiquewhite;
    justify-content: space-between;
}

.tab div{
    width: 50%;
    text-align: center;
    line-height: 10vh;
    font-size: 2vw;
}
</style>